<template>
  <div class="page home-page">
    <img src="../../assets/images/bg.jpg" />
    <div class="content">
      <p>输入宝宝身高/体重/出生日期，和心宝一起看宝宝的生长发育情况吧</p>
      <md-button type="primary" @click="start">开始测评</md-button>

      <md-tabs :active="active" @change="onChange">
        <md-tab title="标签 1">内容 1</md-tab>
        <md-tab title="标签 2">内容 2</md-tab>
        <md-tab title="标签 3">内容 3</md-tab>
        <md-tab title="标签 4">内容 4</md-tab>
      </md-tabs>
    </div>
  </div>
</template>

<script>
export default {
  name: 'home',
  data () {
    return {
      active: 2
    }
  },
  methods: {
    start () {
      console.log('aaa')
    },
    onChange (index) {
      console.log(index)
    }
  }
}
</script>

<style lang="scss" scoped>
.home-page {
  background: #FDEDD4;
  img {
    display: block;
    width: 100%;
  }
  .content {
    p {
      font-size: $font-size-l;
      color:rgba(235,159,41,1);
    }
  }
}
</style>
